<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="format-detection" content="telephone=no" />
    <meta name="format-detection" content="email=no" />
    <title>图文详情</title>
    <link rel="stylesheet" href="../../css/api.css">
    <link rel="stylesheet" href="../../css/main.css">
    <link rel="stylesheet" href="../../css/circle.css">

    <style>
        body,
        html {
            background: transparent;
        }

        .goback {
            color: white;
        }

        .video-detail-head {
            width: 100%;
            background-color: aqua;
            display: flex;
            align-items: center;
            height: 44px;
            padding-left: 10px;
        }
    </style>
</head>

<body style="height: 100%;">
    <div class="app" v-cloak>
        <header style="background: transparent;">
            <div class="flex-x-sb circle-header-container" style="position: relative;">
                <div class="circle-header-btns" @click="handleFun">
                    <span v-for="item in 3" :key="item"></span>
                </div>
                <div class="circle-handle-select-box" v-show="showPopBox">
                    <div class="circle-handle-select-item" @click="showDialog">
                        <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/circle/report_icon.png" />
                        举报
                    </div>
                    <div v-if="screenType==3" class="circle-handle-select-item circle-handle-select-item-delete"
                        @click="deleteTopic">
                        <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/circle/delete_icon.png" />
                        删除
                    </div>
                </div>
            </div>

            <!-- <div class="flex-x-sb video-detail-head">
                    <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/circle/circle_back_ico.png" width="22" height="22" @click="backVideoDetail()" />
                <div class="flex-x-sb circle-header-container" style="position: relative;">
                    <div class="circle-header-btns" @click="handleFun">
                        <span v-for="item in 3" :key="item"></span>
                    </div>
                    <div class="circle-handle-select-box" v-show="showPopBox">
                        <div class="circle-handle-select-item" @click="showDialog">
                            <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/circle/report_icon.png" />
                            举报
                        </div>
                        <div v-if="screenType==3" class="circle-handle-select-item circle-handle-select-item-delete"
                            @click="deleteTopic">
                            <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/circle/delete_icon.png" />
                            删除
                        </div>
                    </div>
                </div>
            </div> -->

        </header>

    </div>
    <script src="../../script/api.js"></script>
    <script src="../../script/flexible.js"></script>
    <script src="../../script/fastclick.js"></script>
    <script src="../../script/vue.min.js"></script>
    <script src="../../script/iconfont.js"></script>
    <script src="../../script/common.js"></script>
    <script src="../../script/businessCommon.js"></script>
    <script src="../../script/restful.js"></script>
    <script>
        apiready = function () {
            // api.alert({
            //     msg: api.pageParam
            // })
            vm = new Vue({
                el: '.app',
                data() {
                    return {
                        module: api.pageParam.module,
                        topicId: api.pageParam.topicId,
                        title: api.pageParam.title,
                        screenType: api.pageParam.screenType,
                        showPopBox: false,
                    }
                },
                mounted() {
                    api.addEventListener({
                        name: 'closeHeadFram'
                    }, (ret, err) => {
                        this.showPopBox = false
                        api.sendEvent({
                            name: 'changeCircleHeadHeight',
                            extra: {
                                show: this.showPopBox
                            }
                        })
                    })
                },
                methods: {
                    // 返回上一级
                    back() {
                        api.closeWin();
                    },
                    backVideoDetail(){
                        api.sendEvent({
                            name: 'backVideoDetail',
                            extra: {
                            }
                        })
                    },
                    handleFun() {
                        this.showPopBox = !this.showPopBox
                        api.sendEvent({
                            name: 'changeCircleHeadHeight',
                            extra: {
                                show: this.showPopBox
                            }
                        })
                    },

                    // 删除动态
                    deleteTopic() {
                        let vm = this
                        api.confirm({
                            title: '是否删除这条动态？',
                            buttons: ['确定', '取消']
                        }, function (ret, err) {
                            if (ret.buttonIndex === 1) {
                                circle("deleteMoment")(vm.topicId, function (ret) {
                                    setTimeout(() => toastBottom("删除成功"), 250)
                                    api.sendEvent({
                                        name:'refreshAllTopic'
                                    })
                                    setTimeout(() => {
                                        api.closeWin()
                                    }, 500)
                                })
                            }
                        });
                    },

                    // 显示分享/举报弹框
                    showDialog() {
                        if (!checkToken()) return false;
                        /*
                            * 参数 1: module: 分享所属模块, 主要用于在report_alert_frm.html中配置分享路径
                            * 参数 2: id: 分享是用id决定是哪个详情页
                            * 参数 3: type: 1是举报, 2是分享
                            * 参数 4: description:  分享标题/描述
                        */
                        toReportOrShareDialog(this.module, this.topicId, 1, this.title)
                    },
                }

            })
        }
    </script>
</body>

</html>